<ion-header class="no-title">
    <ion-toolbar>
        <ion-buttons slot="end">
            <ion-button fill="clear" (click)="closeModal()" [ariaLabel]="'core.close' | translate">
                <ion-icon name="fas-xmark" slot="icon-only" aria-hidden="true" />
            </ion-button>
        </ion-buttons>
    </ion-toolbar>
</ion-header>
<ion-content [fullscreen]="true">
    <ion-refresher slot="fixed" [disabled]="!loaded()" (ionRefresh)="doRefresh($event.target)">
        <ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}" />
    </ion-refresher>
    <core-loading [hideUntil]="loaded()" placeholderType="column" placeholderHeight="120px">
        @if (blocks().length > 0) {
            <ion-list>
                @for (block of blocks(); track block.instanceid) {
                    @if (block.visible) {
                        <core-block [block]="block" [contextLevel]="contextLevel()" [instanceId]="instanceId()" />
                    }
                }
            </ion-list>
        } @else {
            <core-empty-box icon="fas-table-cells-large" [message]="'core.block.noblocks' | translate" />
        }
    </core-loading>
</ion-content>
